import React from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Card, Row, Col, Tabs } from 'antd';
import DeptTree from './components/depttree'
import DeptEdit from './components/deptedit'
import Employee from './components/employee'

const { TabPane } = Tabs;

class DeptPage extends React.Component<any, any> {
    deptEdit: any
    deptTree: any
    constructor(props: any) {
        super(props)
        this.state = {
            parentNode: {},
            currentNode: {}
        }
    }
    componentDidMount() {
    }
    doSetParent(parentNode: any) {
        this.setState({ parentNode });
    }
    doSetCurrent(node: any) {
        this.deptEdit.getData(node);
    }
    freshDept = (e: any) => {
        if (this.deptTree) {
            this.deptTree.fetchData()
        }
    }
    render() {
        return (
            <PageHeaderWrapper title={false}>
                <Row gutter={[12, 12]}>
                    <Col xs={24} sm={12} md={12} lg={12} xl={4} xxl={4}>
                        <Card>
                            <DeptTree
                                setParent={(para: any) => this.doSetParent(para)}
                                setCurrent={(para: any) => this.doSetCurrent(para)}
                                onRef={(ref: any) => { this.deptTree = ref }} />
                        </Card>
                    </Col>
                    <Col xs={24} sm={12} md={12} lg={12} xl={20} xxl={20}>
                        <Card>
                            <Tabs defaultActiveKey="1">
                                <TabPane tab={<span>部门设置</span>} key="1">
                                    <DeptEdit
                                        parentNode={this.state.parentNode}
                                        refresh={this.freshDept}
                                        onRef={(ref: any) => { this.deptEdit = ref }}
                                    />
                                </TabPane>
                                <TabPane tab={<span>员工设置</span>} key="2">
                                    <Employee />
                                </TabPane>
                            </Tabs>

                        </Card>
                    </Col>
                </Row>

            </PageHeaderWrapper>
        )
    }
}
export default DeptPage;